// 封装主题颜色切换相关的业务代码
import { ElMessage } from "element-plus";
import { useDark, useToggle } from "@vueuse/core";
import { getLightColor, getDarkColor } from "@/utils/color";
import { useSettingStore } from "@/store/modules/setting";

//switch开关的chang事件进行暗黑模式的切换
const isDark = useDark();
export function changePrimary(val) {
  useSettingStore().color = val;
  if (!val) {
    val = "#409EFF";
    ElMessage({
      type: "success",
      message: `主题颜色已重置为 ${val}`,
    });
  }
  // 计算主题颜色变化
  document.documentElement.style.setProperty("--el-color-primary", val);
  document.documentElement.style.setProperty(
    "--el-color-primary-dark-2",
    isDark.value ? `${getLightColor(val, 0.2)}` : `${getDarkColor(val, 0.3)}`,
  );
  for (let i = 1; i <= 9; i++) {
    const primaryColor = isDark.value
      ? `${getDarkColor(val, i / 10)}`
      : `${getLightColor(val, i / 10)}`;
    document.documentElement.style.setProperty(
      `--el-color-primary-light-${i}`,
      primaryColor,
    );
  }

  return {
    changePrimary,
  };
}
